import * as echarts from 'echarts';
import './china'

// 基于准备好的dom，初始化echarts实例
const myChart = echarts.init(document.querySelector('.map .chart'));

window.dataList = [
  {
    name: '南海诸岛',
    value: 0
  },
  {
    name: '北京',
    value: 1057
  },
  {
    name: '天津',
    value: 377
  },
  {
    name: '上海',
    value: 1934
  },
  {
    name: '重庆',
    value: 591
  },
  {
    name: '河北',
    value: 1317
  },
  {
    name: '河南',
    value: 1311
  },
  {
    name: '云南',
    value: 325
  },
  {
    name: '辽宁',
    value: 408
  },
  {
    name: '黑龙江',
    value: 1610
  },
  {
    name: '湖南',
    value: 1044
  },
  {
    name: '安徽',
    value: 994
  },
  {
    name: '山东',
    value: 873
  },
  {
    name: '新疆',
    value: 980
  },
  {
    name: '江苏',
    value: 716
  },
  {
    name: '浙江',
    value: 1327
  },
  {
    name: '江西',
    value: 937
  },
  {
    name: '湖北',
    value: 68155
  },
  {
    name: '广西',
    value: 270
  },
  {
    name: '甘肃',
    value: 193
  },
  {
    name: '山西',
    value: 249
  },
  {
    name: '内蒙古',
    value: 377
  },
  {
    name: '陕西',
    value: 578
  },
  {
    name: '吉林',
    value: 573
  },
  {
    name: '福建',
    value: 582
  },
  {
    name: '贵州',
    value: 147
  },
  {
    name: '广东',
    value: 2308
  },
  {
    name: '青海',
    value: 18
  },
  {
    name: '西藏',
    value: 1
  },
  {
    name: '四川',
    value: 959
  },
  {
    name: '宁夏',
    value: 75
  },
  {
    name: '海南',
    value: 171
  },
  {
    name: '台湾',
    value: 1068
  },
  {
    name: '香港',
    value: 11612
  },
  {
    name: '澳门',
    value: 49
  }
];
const option = {
  tooltip: {
    triggerOn: 'click',
    formatter: function (e, t, n) {
      return 0.5 == e.value ? e.name + '：有疑似病例' : e.seriesName + '<br />' + e.name + '：' + e.value;
    }
  },
  visualMap: {
    min: 0,
    max: 100000,
    left: 26,
    bottom: 40,
    showLabel: !0,
    text: ['高', '低'],
    pieces: [
      {
        gt: 50000,
        label: '> 10000 人',
        color: '#7f1100'
      },
      {
        gte: 1000,
        lte: 10000,
        label: '1000 - 10000 人',
        color: '#ff5428'
      },
      {
        gte: 500,
        lt: 1000,
        label: '100 - 1000 人',
        color: '#ff8c71'
      },
      {
        gt: 100,
        lt: 500,
        label: '0 - 100 人',
        color: '#ffd768'
      },
      {
        gt: 0,
        lt: 100,
        label: '0 - 100 人',
        color: '#ffffff'
      }
    ],
    show: !0
  },
  geo: {
    map: 'china',
    roam: !1,
    scaleLimit: {
      min: 1,
      max: 2
    },
    zoom: 1.23,
    top: 120,
    label: {
      normal: {
        show: !0,
        fontSize: '14',
        color: 'rgba(0,0,0,0.7)'
      }
    },
    itemStyle: {
      normal: {
        //shadowBlur: 50,
        //shadowColor: 'rgba(0, 0, 0, 0.2)',
        borderColor: 'rgba(0, 0, 0, 0.2)'
      },
      emphasis: {
        areaColor: '#f2d5ad',
        shadowOffsetX: 0,
        shadowOffsetY: 0,
        borderWidth: 0
      }
    }
  },
  series: [
    {
      name: '确诊病例',
      type: 'map',
      geoIndex: 0,
      data: window.dataList
    }
  ]
};
// 使用刚指定的配置项和数据显示图表。
myChart.setOption(option);
// 自适应
window.addEventListener('resize', function () {
  myChart.resize();
});
